import { PureComponent } from "react";
import { Button, Modal,ActivityIndicator,InputItem,NavBar,Icon,TabBar } from "antd-mobile"
import { connect } from 'dva';
import { handleImg, goToPage,isNull } from "../../utils/helper";
import { setLogout } from "../../utils/request"
import MToast from '../../components/Util/MToast';
@connect(() => {
  return ({

  })
})
export default class My extends PureComponent{
  constructor(props){
    super(props);
    this.state = {
      selectedTab: 'yellowTab',
      open: false,
    }
  }
  componentWillMount(){
    let {dispatch,location} = this.props;

  }
  onOpenChange = () => {
    this.setState({ open: !this.state.open });
  };
  // setLogout=()=>{
  //   let {dispatch,location} = this.props;
  //   dispatch({
  //     type: "form/query",
  //     payload: {
  //       apiInfo: {
  //         "url": "/logout",
  //         "params": [
  //           {
  //             "key": "token",
  //             "value":localStorage[MI_APP_CODE + "mi_token"]
  //           },
  //         ]
  //       },
  //       callback: (result) => {
  //         let { data } = result;
  //         console.log(data)
  //         var storage=window.localStorage;
  //         storage.clear();
  //         // if (browser.isInApp) {
  //         //   Func.callHander(bridge, "logoutSuccess");//解决安卓 浏览器的localStorage清不掉的bug
  //         // }
  //         // else {
  //         //   window.location.reload()
  //         // }
  //         window.location.reload()
  //         // goToPage({ dispatch, config: { url: "/login" }, isReplace: false })
  //       }
  //     }
  //   })
  // }

  render(){
    let {dispatch} = this.props;
    let {img,img1} = this.state;
    return(
      <div style={{height:"100%",position: 'relative',background:'#fff'}}>
        <div style={{position:'relative',width:'100%'}}>
          <img src="image/myHeader.png" style={{width:'100%'}}/>
          <img src="image/avatar.png" style={{width:'72px',position:'absolute',top:'34%',left:'39%'}}/>
          <div style={{position:'absolute',top:'61%',left:'43%',color:'#FFFFFF',fontSize:'17px'}}>{localStorage[MI_APP_CODE+"username"]}</div>
          <div style={{width:'80%',margin:'0 auto',background:'#fff',borderRadius:'5px',padding:'20px 16px 20px 24px',position:'absolute',bottom:'-40px',left:'11%',zIndex:'10',boxShadow: '3px 3px 3px rgba(0,0,0,.2)'}}>
            <div style={{width:'90%',display:'inline-block'}}>
              <div style={{width:'100%',color:'#000000',fontSize:'20px'}}>Il mio ordine</div>
              <div style={{width:'100%',color:'#595867',fontSize:'15px'}}>我的订单</div>
            </div>
            <div style={{width:'5%',display:'inline-block'}} onClick={()=>goToPage({ dispatch, config: { url: "/myOrder" }, isReplace: false })}>
              <img src='image/arrow_right.png' style={{width:'24px'}}/>
            </div>
          </div>
          <div style={{width:'100%',borderRadius:'20px',position:'absolute',bottom:'-122%',height:'300px',background:'#fff',textAlign:'center',}}>
            <img src="image/slice.png" style={{width:'240px',marginTop:'21%'}}/>
          </div>
          <div style={{width:'80%',margin:'0 auto',position:'absolute',top:'216%',left:'10%'}}>
            {/*<Button type="primary" style={{fontSize:'14px',width:'100%'}}>Esci 退出</Button>*/}
            <Button style={{ background: "#ed4747", color: "#fff", borderRadius: "15px",width:'100%' }} size="default" onClick={() => {
              Modal.alert('温馨提示', '确定退出登录?', [{ text: '取消' },
                {
                  text: '确定',
                  onPress: () => {
                    this.onOpenChange()
                  setLogout();
                  }
                }])
            }}>退出登录</Button>
          </div>
        </div>

        <div style={{position:'fixed',bottom:'0px',left:'0px',width:'100%'}}> <TabBar
          unselectedTintColor="#949494"
          tintColor="#F09600"
          barTintColor="white"
          hidden={this.state.hidden}
        >
          <TabBar.Item
            title="首页"
            key="Life"
            icon={<div style={{
              width: '24px',
              height: '24px',
              background: 'url(image/home2.png) center center /  21px 21px no-repeat' }}
            />
            }
            selectedIcon={<div style={{
              width: '24px',
              height: '24px',
              background: 'url(image/home3.png) center center /  21px 21px no-repeat' }}
            />
            }
            selected={this.state.selectedTab === 'redTab'}
            onPress={() => {
              this.setState({
                selectedTab: 'redTab',
              });
              goToPage({ dispatch, config: { url: "/shop_home" }, isReplace: false })
            }}
            data-seed="logId"
          >

          </TabBar.Item>
          <TabBar.Item
            icon={
              <div style={{
                width: '24px',
                height: '24px',
                background: 'url(image/category.png) center center /  21px 21px no-repeat' }}
              />
            }
            selectedIcon={
              <div style={{
                width: '24px',
                height: '24px',
                background: 'url(image/category1.png) center center /  21px 21px no-repeat' }}
              />
            }
            title="分类"
            key="Koubei"

            selected={this.state.selectedTab === 'blueTab'}
            onPress={() => {
              this.setState({
                selectedTab: 'blueTab',
              });
              goToPage({ dispatch, config: { url: "/category" }, isReplace: false })
            }}
            data-seed="logId1"
          >

          </TabBar.Item>
          <TabBar.Item
            icon={
              <div style={{
                width: '24px',
                height: '24px',
                background: 'url(image/cart4.png) center center /  21px 21px no-repeat' }}
              />
            }
            selectedIcon={
              <div style={{
                width: '24px',
                height: '24px',
                background: 'url(image/cart5.png) center center /  21px 21px no-repeat' }}
              />
            }
            title="购物车"
            key="Friend"
            selected={this.state.selectedTab === 'greenTab'}
            onPress={() => {
              this.setState({
                selectedTab: 'greenTab',
              });
              goToPage({ dispatch, config: { url: "/goodcart" }, isReplace: false })
            }}
          >

          </TabBar.Item>
          <TabBar.Item
            icon={{ uri: 'image/my.png' }}
            selectedIcon={{ uri: 'image/my1.png' }}
            title="我的"
            key="my"
            selected={this.state.selectedTab === 'yellowTab'}
            onPress={() => {
              this.setState({
                selectedTab: 'yellowTab',
              });
              goToPage({ dispatch, config: { url: "/my" }, isReplace: false })
            }}

          >

          </TabBar.Item>
        </TabBar></div>
      </div>
    )
  }
}
